<!DOCTYPE html>
<html lang="zh">

<head>

    <!-- <script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"> -->
    <!-- </script> -->
    <!-- <script>
        (adsbygoogle = window.adsbygoogle || []).push({
            google_ad_client: "ca-pub-8550836177608334",
            enable_page_level_ads: true
        });
    </script> -->
    <!-- <script>
        var _hmt = _hmt || [];
        (function () {
            var hm = document.createElement("script");
            hm.src = "https://hm.baidu.com/hm.js?c05bb16ea908292af9f6c513087a1cc3";
            var s = document.getElementsByTagName("script")[0];
            s.parentNode.insertBefore(hm, s);
        })();
    </script> -->
    <!-- jQuery -->
    <script src="https://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js">
    </script>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <meta name="author" content="viggo" />
    <title>9班导航</title>
    <!-- <meta name="keywords" content="UI设计,UI设计素材,设计导航,网址导航,设计资源,创意导航,创意网站导航,设计师网址大全,设计素材大全,设计师导航,UI设计资源,优秀UI设计欣赏,设计师导航,设计师网址大全,设计师网址导航,产品经理网址导航,交互设计师网址导航,www.webstack.cc"> -->
    <meta name="description" content="9班导航 made by 9班人">
    <link rel="shortcut icon" href="../assets/images/favicon.png">
    <link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Arimo:400,700,400italic">
    <link rel="stylesheet" href="../assets/css/fonts/linecons/css/linecons.css">
    <link rel="stylesheet" href="../assets/css/fonts/fontawesome/css/font-awesome.min.css">
    <link rel="stylesheet" href="../assets/css/bootstrap.css">
    <link rel="stylesheet" href="../assets/css/xenon-core.css">
    <link rel="stylesheet" href="../assets/css/xenon-components.css">
    <link rel="stylesheet" href="../assets/css/xenon-skins.css">
    <link rel="stylesheet" href="../assets/css/nav.css">
    <script src="../assets/js/jquery-1.11.1.min.js"></script>
    <!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
    <!--[if lt IE 9]>
        <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
        <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
    <![endif]-->
    <!-- / FB Open Graph -->
    <!-- <meta property="og:type" content="article">
    <meta property="og:url" content="http://www.webstack.cc/">
    <meta property="og:title" content="WebStack - 收集国内外优秀设计网站、UI设计资源网站、灵感创意网站、素材资源网站，定时更新分享优质产品设计书签。www.webstack.cc">
    <meta property="og:description" content="UI设计,UI设计素材,设计导航,网址导航,设计资源,创意导航,创意网站导航,设计师网址大全,设计素材大全,设计师导航,UI设计资源,优秀UI设计欣赏,设计师导航,设计师网址大全,设计师网址导航,产品经理网址导航,交互设计师网址导航,www.webstack.cc">
    <meta property="og:image" content="http://webstack.cc/assets/images/webstack_banner_cn.png">
    <meta property="og:site_name" content="WebStack - 收集国内外优秀设计网站、UI设计资源网站、灵感创意网站、素材资源网站，定时更新分享优质产品设计书签。www.webstack.cc"> -->
    <!-- / Twitter Cards -->
    <!-- <meta name="twitter:card" content="summary_large_image">
    <meta name="twitter:title" content="WebStack - 收集国内外优秀设计网站、UI设计资源网站、灵感创意网站、素材资源网站，定时更新分享优质产品设计书签。www.webstack.cc">
    <meta name="twitter:description" content="UI设计,UI设计素材,设计导航,网址导航,设计资源,创意导航,创意网站导航,设计师网址大全,设计素材大全,设计师导航,UI设计资源,优秀UI设计欣赏,设计师导航,设计师网址大全,设计师网址导航,产品经理网址导航,交互设计师网址导航,www.webstack.cc"> -->
    <!-- <meta name="twitter:image" content="http://www.webstack.cc/assets/images/webstack_banner_cn.png"> -->
</head>

<body class="page-body">

    <!-- skin-white -->
    <div class="page-container">
        <div class="sidebar-menu toggle-others fixed">
            <div class="sidebar-menu-inner">
                <header class="logo-env">
                    <!-- logo -->
                    <div class="logo">
                        <a href="index.html" class="logo-expanded">
                            <img src="../assets/images/logo_white@2x.png" width="100%" alt="" />
                        </a>
                        <a href="index.html" class="logo-collapsed">
                            <img src="../assets/images/logo-collapsed@2x.png" width="40" alt="" />
                        </a>
                    </div>
                    <div class="mobile-menu-toggle visible-xs">
                        <a href="#" data-toggle="user-info-menu">
                            <i class="linecons-cog"></i>
                        </a>
                        <a href="#" data-toggle="mobile-menu">
                            <i class="fa-bars"></i>
                        </a>
                    </div>
                </header>
                <ul id="main-menu" class="main-menu">
                    <li>
                        <a href="#常用推荐" class="smooth">
                            <i class="linecons-star"></i>
                            <span class="title">常用推荐</span>
                        </a>
                    </li>
                    <li>
                        <a href="#学习工具" class="smooth">
                            <i class="linecons-tag"></i>
                            <span class="title">授课软件</span>
                        </a>
                    </li>
                    <li>
                        <!--
                        <a>
                            <i class="linecons-lightbulb"></i>
                            <span class="title">灵感采集</span>
                        </a>
                        <ul>
                            <li>
                                <a href="#发现产品" class="smooth">
                                    <span class="title">发现产品</span>
                                </a>
                            </li>
                            <li>
                                <a href="#界面灵感" class="smooth">
                                    <span class="title">界面灵感</span>
                                </a>
                            </li>
                            <li>
                                <a href="#网页灵感" class="smooth">
                                    <span class="title">网页灵感</span>
                                    <span class="label label-pink pull-right hidden-collapsed">Hot</span>
                                </a>
                            </li>
                        </ul>
                    </li>
                    <li>
                        <a>
                            <i class="linecons-thumbs-up"></i>
                            <span class="title">素材资源</span>
                        </a>
                        <ul>
                            <li>
                                <a href="#图标素材" class="smooth">
                                    <span class="title">图标素材</span>
                                </a>
                            </li>
                            <li>
                                <a href="#LOGO设计" class="smooth">
                                    <span class="title">LOGO设计</span>
                                </a>
                            </li>
                            <li>
                                <a href="#平面素材" class="smooth">
                                    <span class="title">平面素材</span>
                                </a>
                            </li>
                            <li>
                                <a href="#UI资源" class="smooth">
                                    <span class="title">UI资源</span>
                                </a>
                            </li>
                            <li>
                                <a href="#Sketch资源" class="smooth">
                                    <span class="title">Sketch资源</span>
                                </a>
                            </li>
                            <li>
                                <a href="#字体资源" class="smooth">
                                    <span class="title">字体资源</span>
                                </a>
                            </li>
                            <li>
                                <a href="#Mockup" class="smooth">
                                    <span class="title">Mockup</span>
                                </a>
                            </li>
                            <li>
                                <a href="#摄影图库" class="smooth">
                                    <span class="title">摄影图库</span>
                                </a>
                            </li>
                            <li>
                                <a href="#PPT资源" class="smooth">
                                    <span class="title">PPT资源</span>
                                </a>
                            </li>
                        </ul>
                    </li> -->
                        <!-- <li>
                        <a>
                            <i class="linecons-diamond"></i>
                            <span class="title">常用工具</span>
                        </a>
                        <ul>
                            <li>
                                <a href="#图形创意" class="smooth">
                                    <span class="title">图形创意</span>
                                </a>
                            </li>
                            <li>
                                <a href="#界面设计" class="smooth">
                                    <span class="title">界面设计</span>
                                </a>
                            </li>
                            <li>
                                <a href="#交互动效" class="smooth">
                                    <span class="title">交互动效</span>
                                </a>
                            </li>
                            <li>
                                <a href="#在线配色" class="smooth">
                                    <span class="title">在线配色</span>
                                </a>
                            </li>
                            <li>
                                <a href="#在线工具" class="smooth">
                                    <span class="title">在线工具</span>
                                </a>
                            </li>
                             <li>
                                <a href="#Sketch插件" class="smooth">
                                    <span class="title">Sketch插件</span>
                                </a>
                            </li> 
                            <li>
                                <a href="#Chrome插件" class="smooth">
                                    <span class="title">Chrome插件</span>
                                </a>
                            </li>
                             <li>
                                <a href="#H5制作" class="smooth">
                                    <span class="title">H5制作</span>
                                </a>
                            </li> 
                        </ul>
                    </li>
                    <li>
                        <a>
                            <i class="linecons-pencil"></i>
                            <span class="title">学习教程</span>
                        </a>
                        <ul>
                            <li>
                                <a href="#设计规范" class="smooth">
                                    <span class="title">设计规范</span>
                                </a>
                            </li>
                            <li>
                                <a href="#视频教程" class="smooth">
                                    <span class="title">视频教程</span>
                                </a>
                            </li>
                            <li>
                                <a href="#设计文章" class="smooth">
                                    <span class="title">设计文章</span>
                                </a>
                            </li>
                            <li>
                                <a href="#设计电台" class="smooth">
                                    <span class="title">设计电台</span>
                                </a>
                            </li>
                            <li>
                                <a href="#交互设计" class="smooth">
                                    <span class="title">交互设计</span>
                                    <span class="label label-pink pull-right hidden-collapsed">Hot</span>
                                </a>
                            </li>
                        </ul>
                    </li>
                    <li>
                        <a href="#UED团队" class="smooth">
                            <i class="linecons-user"></i>
                            <span class="title">UED团队</span>
                        </a>
                    </li> -->
                    <li>
                        <a href="about.html">
                            <i class="linecons-heart"></i>
                            <span class="tooltip-blue">关于本站</span>
                            <span class="label label-Primary pull-right hidden-collapsed">♥︎</span>
                        </a>
                    </li>
                    <!-- <div class="submit-tag">
                        <a href="about.html">
                            <i class="linecons-heart"></i>
                            <span class="tooltip-blue">关于本站</span>
                            <span class="label label-Primary pull-right hidden-collapsed">♥︎</span>
                        </a>
                    </div> -->
                </ul>
            </div>
        </div>
        <div class="main-content">
            <nav class="navbar user-info-navbar" role="navigation">

                <!-- User Info, Notifications and Menu Bar -->
                <!-- Left links for user info navbar -->
                <ul class="user-info-menu left-links list-inline list-unstyled">

                    <li class="hidden-sm hidden-xs">
                        <a href="#" data-toggle="sidebar">
                            <i class="fa-bars"></i>
                        </a>
                    </li>
                    <!-- 选择语言 -->
                    <li class="dropdown hover-line language-switcher">
                        <a href="../cn/index.html" class="dropdown-toggle" data-toggle="dropdown">
                            <img src="../assets/images/flags/flag-cn.png" alt="flag-cn" /> 简体中文
                        </a>
                        <ul class="dropdown-menu languages">
                            <li>
                                <a onclick="alert('啥？你还想要英文？鬼！写个中文就不错了')">
                                    <img src="../assets/images/flags/flag-us.png" alt="flag-us" /> English
                                </a>
                            </li>
                            <li class="active">
                                <a href="../cn/index.html">
                                    <img src="../assets/images/flags/flag-cn.png" alt="flag-cn" /> 简体中文
                                </a>
                            </li>
                        </ul>
                    </li>
                    <!-- 选择网站 -->

                    <li class="dropdown hover-line language-switcher">
                        <a href="../cn/index.html" class="dropdown-toggle" data-toggle="dropdown">
                            9班导航
                        </a>
                        <ul class="dropdown-menu languages">
                            <li>
                                <a href="https://www.ybbsb.ga/">
                                    <!-- <img src="../assets/images/flags/flag-us.png" alt="flag-us" /> -->追光 | 9班
                                </a>
                            </li>
                            <li class="active">
                                <a href="../cn/index.html">
                                    <!-- <img src="../assets/images/flags/flag-cn.png" alt="flag-cn" /> -->9班导航
                                </a>
                            </li>
                        </ul>

                    </li>
                </ul>

                <!-- 倒计时 -->
                <script>
                    let future = new Date(2023, 05, 21);
                    function time() {
                        let N = new Date();
                        let d = (future.getTime() - N.getTime()) / 86400000;
                        let h = (future.getTime() - N.getTime()) % 86400000 / 3600000;
                        let m = (future.getTime() - N.getTime()) % 3600000 / 60000;
                        let s = (future.getTime() - N.getTime()) % 60000 / 1000;
                        document.getElementById("zhongkao").innerHTML = "距离中考只剩：" + d.toFixed(0) + "天" + h.toFixed(0) + "小时" + m.toFixed(0) + "分钟" + s.toFixed(0) + "秒"
                    }

                    setInterval(time, 1000);
                </script>
                <ul class="user-info-menu right-links list-inline list-unstyled"
                    style="padding-left: 33%;float: unset;">
                    <li class="hidden-sm hidden-xs">
                        <!-- <a href="https://github.com/WebStackPage/WebStackPage.github.io" target="_blank">
                            <i class="fa-github"></i>  GitHub
                        </a> -->
                        <!-- <h1 id="zhongkao">距离中考只剩：xxx天x小时xx分钟xx秒</h1> -->
                    </li>
                </ul>
                <!-- <a href="https://github.com/WebStackPage/WebStackPage.github.io" target="_blank"><img style="position: absolute; top: 0; right: 0; border: 0;" src="https://s3.amazonaws.com/github/ribbons/forkme_right_darkblue_121621.png" alt="Fork me on GitHub"></a> -->

            </nav>
            <!-- 常用推荐 -->

            <style>
                .baiducontainer {

                    width: 600px;

                    height: 20px;

                    margin: 100px auto;

                }



                .baiduparent {

                    width: 100%;

                    height: 42px;

                    top: 4px;

                    position: relative;

                }

                .baiduparent>input.change::placeholder {
                    color: #fff;
                }

                .baiduparent>input:first-of-type {

                    /*输入框高度设置为40px, border占据2px，总高度为42px*/

                    width: 480px;

                    height: 50px;

                    border: 1px solid #ccc;

                    font-size: 16px;

                    outline: none;
                    border-radius: 10cm;
                }

                .baiduparent>input::placeholder {
                    padding-left: 5%;
                }

                .baiduparent>input:first-of-type:focus {

                    border: 1px solid #317ef3;

                    padding-left: 10px;

                }



                .baiduparent>input:last-of-type {

                    /*button按钮border并不占据外围大小，设置高度42px*/

                    width: 100px;

                    height: 50px;

                    position: absolute;

                    background: #317ef3;

                    border: 1px solid #317ef3;

                    color: #fff;

                    font-size: 16px;

                    outline: none;
                    border-radius: 10cm;
                }
            </style>

            <script>
                // $("#baiduinput").keydown(function (e) {
                //     if (e.keyCode == 13) {
                //         baidu(); //百度一下
                //     }
                // });

                function baidu() {
                    // var text_empty=undefined;
                    var holder_text = document.getElementById("baiduinput").placeholder;

                    console.log(holder_text);
                    var baidutext = document.getElementById("baiduinput").value;

                    if (baidutext.length == 0) {
                        // document.getElementById("baiduinput").value = "你还没有输入内容！";
                        document.getElementById("baiduinput").setAttribute("placeholder", "你还没有输入内容!");
                    }
                    else {
                        window.open('https://www.baidu.com/s?&wd=' + baidutext, '_blank')

                    };


                };

                // 一言api
                // fetch('https://v1.hitokoto.cn')
                //     .then(response => response.json())
                //     .then(data => {
                //         const hitokoto = document.querySelector('#baiduinput')
                //         // const hitokoto = document.getElementById("baiduinput").setAttribute("placeholder")
                //         hitokoto.href = `https://hitokoto.cn/?uuid=${data.uuid}`
                //         hitokoto.innerText = data.hitokoto
                //     })
                //     .catch(console.error)
            </script>
            <script>
                window.onload = function () {


                    var baiduinput = document.getElementById("baiduinput")
                    baiduinput.addEventListener("keyup", function (event) {
                        event.preventDefault()
                        if (event.keyCode == 13) {
                            baidu()

                        }
                    });
                }

            </script>
            <form class="baiducontainer" onsubmit="return false;">
                <div style="position:relative;bottom: 100%;">
                    <h1 id="zhongkao">距离中考只剩：xxx天x小时xx分钟xx秒</h1>
                </div>
                <div class="baiduparent">


                    <input id="baiduinput" type="text" placeholder="请输入你的搜索内容。" autofocus="autofocus"
                        contenteditable="true"
                        onblur="document.getElementById('baiduinput').placeholder = '请输入你的搜索内容。';">
                    <i class="fa-solid fa-xmark"></i>
                    <input type="button" value="百度一下" onclick="baidu()"
                        onblur="document.getElementById('baiduinput').placeholder = '请输入你的搜索内容。';">

                    <!-- <input id="baiduinput" type="text" placeholder="请输入你的搜索内容。"
                        onblur="document.getElementById('baiduinput').placeholder = '请输入你的搜索内容。';">
                    <i class="fa-solid fa-xmark"></i>
                    <input type="button" value="百度一下" onclick="baidu()"
                        onblur="document.getElementById('baiduinput').placeholder = '请输入你的搜索内容。';">
                     -->

            </form>

        </div>

        <h4 class="text-gray"><i class="linecons-star" style="margin-right: 7px;" id="常用推荐"></i>常用推荐</h4>
        <div class="row">

            <!-- 哔哩哔哩bilibili -->
            <div class="col-sm-3">
                <div class="xe-widget xe-conversations box2 label-info"
                    onclick="window.open('https://www.bilibili.com/', '_blank')" data-toggle="tooltip"
                    data-placement="bottom" title="" data-original-title="https://www.bilibili.com/">
                    <div class="xe-comment-entry">
                        <a class="xe-user-img">
                            <img data-src="../assets/images/logos/bilibili.png" class="lozad img-circle" width="40">
                        </a>
                        <span class="label label-info" data-toggle="tooltip" data-placement="left" title=""
                            data-original-title="Hello I am a Tooltip"></span>
                        <div class="xe-comment">
                            <a href="#" class="xe-user-name overflowClip_1">
                                <strong>哔哩哔哩</strong>
                            </a>
                            <p class="overflowClip_2">学习网站一个~</p>
                        </div>
                    </div>
                </div>
            </div>

            <!-- 百度 -->
            <div class="col-sm-3">
                <div class="xe-widget xe-conversations box2 label-info"
                    onclick="window.open('https://www.baidu.com/', '_blank')" data-toggle="tooltip"
                    data-placement="bottom" title="" data-original-title="https://www.baidu.com/">
                    <div class="xe-comment-entry">
                        <a class="xe-user-img">
                            <img data-src="../assets/images/logos/baidu.png" class="lozad img-circle" width="40">
                        </a>
                        <span class="label label-info" data-toggle="tooltip" data-placement="left" title=""
                            data-original-title="Hello I am a Tooltip"></span>
                        <div class="xe-comment">
                            <a href="#" class="xe-user-name overflowClip_1">
                                <strong>百度</strong>
                            </a>
                            <p class="overflowClip_2">搜索引擎一个~</p>
                        </div>
                    </div>
                </div>
            </div>

            <!-- 国家中小学智慧教育平台 -->
            <div class="col-sm-3">
                <div class="xe-widget xe-conversations box2 label-info"
                    onclick="window.open('https://www.zxx.edu.cn/', '_blank')" data-toggle="tooltip"
                    data-placement="bottom" title="" data-original-title="https://www.zxx.edu.cn/">
                    <div class="xe-comment-entry">
                        <a class="xe-user-img">
                            <img data-src="https://www.zxx.edu.cn/favicon.ico" class="lozad img-circle" width="40">
                        </a>
                        <span class="label label-info" data-toggle="tooltip" data-placement="left" title=""
                            data-original-title="Hello I am a Tooltip"></span>
                        <div class="xe-comment">
                            <a href="#" class="xe-user-name overflowClip_1">
                                <strong>国家中小学智慧教育平台</strong>
                            </a>
                            <p class="overflowClip_2">国家中小学智慧教育平台~</p>
                        </div>
                    </div>
                </div>
            </div>

            <!-- 螺蛳教育 -->
            <div class="col-sm-3">
                <div class="xe-widget xe-conversations box2 label-info"
                    onclick="window.open('https://space.bilibili.com/392022876?spm_id_from=333.337.search-card.all.click', '_blank')"
                    data-toggle="tooltip" data-placement="bottom" title=""
                    data-original-title="https://space.bilibili.com/392022876?spm_id_from=333.337.search-card.all.click">
                    <div class="xe-comment-entry">
                        <a class="xe-user-img">
                            <img data-src="../assets/images/logos/luosi.png" class="lozad img-circle" width="40">
                        </a>
                        <span class="label label-info" data-toggle="tooltip" data-placement="left" title=""
                            data-original-title="Hello I am a Tooltip"></span>
                        <div class="xe-comment">
                            <a href="#" class="xe-user-name overflowClip_1">
                                <strong>螺蛳教育</strong>
                            </a>
                            <p class="overflowClip_2">螺蛳教育，幽默风趣~</p>
                        </div>
                    </div>
                </div>

            </div>
        </div>
        <br />
        <!-- 授课软件 -->
        <h4 class="text-gray"><i class="linecons-tag" style="margin-right: 7px;" id="授课软件"></i>授课软件</h4>
        <div class="row">

            <!-- 希沃白板 -->
            <div class="col-sm-3">
                <div class="xe-widget xe-conversations box2 label-info"
                    onclick="window.open('http://easinote.seewo.com/', '_blank')" data-toggle="tooltip"
                    data-placement="bottom" title="" data-original-title="http://easinote.seewo.com/">
                    <div class="xe-comment-entry">
                        <a class="xe-user-img">
                            <img data-src="https://store-g1.seewo.com/enweb/images/share@256.png"
                                class="lozad img-circle" width="40">
                        </a>
                        <span class="label label-info" data-toggle="tooltip" data-placement="left" title=""
                            data-original-title="Hello I am a Tooltip"></span>
                        <div class="xe-comment">
                            <a href="#" class="xe-user-name overflowClip_1">
                                <strong>希沃白板</strong>

                            </a>
                            <p class="overflowClip_2">听说老师都喜欢~</p>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <br />
        <!-- 实用工具 -->
        <h4 class="text-gray"><i class="linecons-tag" style="margin-right: 7px;" id="授课软件"></i>实用工具</h4>
        <div class="row">

            <!-- Desmos提供一流的计算器、数字化数学课程和教学大纲，以此帮助每一位学生学习数学并爱上数学。 -->
            <div class="col-sm-3">
                <div class="xe-widget xe-conversations box2 label-info"
                    onclick="window.open('https://www.desmos.com/?lang=zh-CN','_blank')" data-toggle="tooltip"
                    data-placement="bottom" title="" data-original-title="https://www.desmos.com/?lang=zh-CN">
                    <div class="xe-comment-entry">
                        <a class="xe-user-img">
                            <img data-src="https://www.desmos.com/favicon.ico" class="lozad img-circle" width="40">
                        </a>
                        <span class="label label-info" data-toggle="tooltip" data-placement="left" title=""
                            data-original-title="Hello I am a Tooltip"></span>
                        <div class="xe-comment">
                            <a href="#" class="xe-user-name overflowClip_1">
                                <strong>Desmos</strong>
                            </a>
                            <p class="overflowClip_2">Desmos提供一流的计算器、数字化数学课程和教学大纲，以此帮助每一位学生学习数学并爱上数学。</p>
                        </div>
                    </div>
                </div>
            </div>
            <!-- myfreemusic -->
            <div class="col-sm-3">
                <div class="xe-widget xe-conversations box2 label-info"
                    onclick="window.open('https://tool.liumingye.cn/music/#/','_blank')" data-toggle="tooltip"
                    data-placement="bottom" title="" data-original-title="https://tool.liumingye.cn/music/#/">
                    <div class="xe-comment-entry">
                        <a class="xe-user-img">
                            <img data-src="https://npm.elemecdn.com/@liumingye/cdn2/favicon.ico"
                                class="lozad img-circle" width="40">
                        </a>
                        <span class="label label-info" data-toggle="tooltip" data-placement="left" title=""
                            data-original-title="Hello I am a Tooltip"></span>
                        <div class="xe-comment">
                            <a href="#" class="xe-user-name overflowClip_1">
                                <strong>MyfreemMP3</strong>
                            </a>
                            <p class="overflowClip_2">懂的都懂</p>
                        </div>
                    </div>
                </div>
            </div>
            <div class="col-sm-3">
                <div class="xe-widget xe-conversations box2 label-info"
                    onclick="window.open('http://cn-yw-plc-4.openfrp.top:16588/','_blank')" data-toggle="tooltip"
                    data-placement="bottom" title="" data-original-title="http://cn-yw-plc-4.openfrp.top:16588/">
                    <div class="xe-comment-entry">
                        <a class="xe-user-img">
                            <img data-src="https://img.gejiba.com/images/aa0d3e15ca7de053e87e8624dc2ce28f.th.jpg"
                                class="lozad img-circle" width="40">
                        </a>
                        <span class="label label-info" data-toggle="tooltip" data-placement="left" title="http://cn-yw-plc-4.openfrp.top:16588/"
                            data-original-title="Hello I am a Tooltip"></span>
                        <div class="xe-comment">
                            <a href="#" class="xe-user-name overflowClip_1">
                                <strong>Alist</strong>
                            </a>
                            <p class="overflowClip_2">内网穿透的网盘服务</p>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <br />

        <!-- end! -->

        <br />
        <!-- END 常用推荐 -->
        <div style="bottom: 16px;">
            <p style="text-align: center;font-size: larger;" id="hitokoto"></p>
        </div>

        <!-- Main Footer -->
        <!-- Choose between footer styles: "footer-type-1" or "footer-type-2" -->
        <!-- Add class "sticky" to  always stick the footer to the end of page (if page contents is small) -->
        <!-- Or class "fixed" to  always fix the footer to the end of page -->
        <footer class="main-footer sticky footer-type-1">
            <div class="footer-inner">
                <!-- Add your copyright text here -->
                <div class="footer-text">
                    <!-- &copy; 2017-2022
                        <a href="../cn/about.html"><strong>WebStack</strong></a> design by <a
                            href="https://www.viggoz.com" target="_blank"><strong>Viggo</strong></a> -->
                    <!--  - Purchase for only <strong>23$</strong> -->
                    <strong>中考加油！</strong>
                </div>
                <!-- Go to Top Link, just add rel="go-top" to any link to add this functionality -->
                <div class="go-up">
                    <a href="#" rel="go-top">
                        <i class="fa-angle-up"></i>
                    </a>
                </div>
            </div>
        </footer>
        <!-- <style>
            #closemusic {
                /* background-color: #3fefff; */
                border: none;
                border-radius: 3px;
                color: #000000;
                position: relative;
                left: 90%;
                /* bottom: 375px; */
                top: 35px;
                /* padding: 10px 20px; */
                opacity: 1;
            }
        </style>
        <div id="musicdiv" style="position: fixed;z-index: 999;right: 0%;opacity: 0.8;bottom: 1%;">
            <button type="submit" id="closemusic">X</button>
            <iframe id="music" src="https://music.163.com/outchain/player?type=0&id=7684882264&auto=0&height=430"
                width="100%" height="400" frameborder="no" marginwidth="0" marginheight="0"></iframe>
    
        </div>
    
        <script>
    
    
            var btn = document.getElementById("closemusic")
            // var btn_text = document.getElementById("closemusic")
    
            btn.addEventListener('click', function (event) {
                document.getElementById("music").style.display = "none";
                document.getElementById("closemusic").style.display = "none";
                // btn_text.innerHTML="点击我打开";
            })
        </script> -->

    </div>
    </div>
    <!-- 锚点平滑移动 -->
    <script type="text/javascript">
        $(document).ready(function () {
            //img lazy loaded
            const observer = lozad();
            observer.observe();

            $(document).on('click', '.has-sub', function () {
                var _this = $(this)
                if (!$(this).hasClass('expanded')) {
                    setTimeout(function () {
                        _this.find('ul').attr("style", "")
                    }, 300);

                } else {
                    $('.has-sub ul').each(function (id, ele) {
                        var _that = $(this)
                        if (_this.find('ul')[0] != ele) {
                            setTimeout(function () {
                                _that.attr("style", "")
                            }, 300);
                        }
                    })
                }
            })
            $('.user-info-menu .hidden-sm').click(function () {
                if ($('.sidebar-menu').hasClass('collapsed')) {
                    $('.has-sub.expanded > ul').attr("style", "")
                } else {
                    $('.has-sub.expanded > ul').show()
                }
            })
            $("#main-menu li ul li").click(function () {
                $(this).siblings('li').removeClass('active'); // 删除其他兄弟元素的样式
                $(this).addClass('active'); // 添加当前元素的样式
            });
            $("a.smooth").click(function (ev) {
                ev.preventDefault();

                public_vars.$mainMenu.add(public_vars.$sidebarProfile).toggleClass('mobile-is-visible');
                ps_destroy();
                $("html, body").animate({
                    scrollTop: $($(this).attr("href")).offset().top - 30
                }, {
                    duration: 500,
                    easing: "swing"
                });
            });
            return false;
        });

        var href = "";
        var pos = 0;
        $("a.smooth").click(function (e) {
            $("#main-menu li").each(function () {
                $(this).removeClass("active");
            });
            $(this).parent("li").addClass("active");
            e.preventDefault();
            href = $(this).attr("href");
            pos = $(href).position().top - 30;
        });
    </script>
    <!-- Bottom Scripts -->
    <script src="../assets/js/bootstrap.min.js"></script>
    <script src="../assets/js/TweenMax.min.js"></script>
    <script src="../assets/js/resizeable.js"></script>
    <script src="../assets/js/joinable.js"></script>
    <script src="../assets/js/xenon-api.js"></script>
    <script src="../assets/js/xenon-toggles.js"></script>
    <!-- JavaScripts initializations and stuff -->
    <script src="../assets/js/xenon-custom.js"></script>
    <script src="../assets/js/lozad.js"></script>
    <!-- 一言api -->
    <script src="https://v1.hitokoto.cn/?encode=js&select=%23hitokoto" defer></script>

</body>

</html>